HTML formulieren maken

Doelstelling

Je leert hoe je een invoerformulier maakt met html elementen. We zorgen ervoor dat het formulier:

• opgebouwd is met de sematisch juiste elementen;
• de invoer zoveel mogelijk gecontroleerd wordt door aangepaste html elementen en attributen te gebruiken;

Leerpad

1. Wat is een formulier
2. Elementen
   1. Het form element
   2. Het label element
   3. Het input element
   4. De submit knop
   5. Tekstvak
   6. Tekstgebied
   7. Wachtwoord
   8. Keuzerondje
   9. Selectievak
   10. Keuzelijst
   11. Elementen groeperen
   12. Datum- en tijdinvoer
   13. E-mailinvoer
   14. Range
   15. Bestanduploadvak
3. Attributen
   1. HTML formulier attributen
4. Voorbeeld
   1. Tekst en uitleg
      1. Een HTML formulier eerste versie
      2. Een HTML formulier tweede versie
   2. Filmpjes:
      1. Formulier voorbereiden om later met een serverside scripting taal, bijvoorbeeld PHP, te verwerken
      2. Inspecteren hoe de browser de ingevoerde gegevens verstuurt naar de server
5. Soorten formulieren

Opdracht

1. In de eerste opdracht maak je de HTML voor een formulier: Opdracht form HTML
2. In de tweede opdracht maak je het formulier en de elementen erin op met CSS: Opdracht form CSS

Bronnen

Smashing Magazine, Building Forms The Easy Way, July 2018